<template>
    <view>
        <view class="d-kuan" @click="url('index/index',0)">
			<view class="daohang-1 d-yuanjiao-50 d-shangxia-10" :class="{'d-beijing-bai': activeLei === 0}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/qingchun-shouye.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">最新</view>
			</view>
		</view>
		<view class="d-kuan d-shangxia-15"  @click="url('quan/index',1)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 1}">
				<view class="daohang-2 ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/tui2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">推荐</view>
			</view>
		</view>
		<view class="d-kuan d-shangxia-15" @click="url('zhishi/index',2)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 2}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/jinghua2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">精华</view>
			</view>
		</view>
		<view class="d-kuan d-shangxia-15" @click="url('wenda/index',3)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 3}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/remen2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">热门</view>
			</view>
		</view>
		<view class="d-kuan d-shangxia-15" @click="url('shouce/index',4)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 4}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/reping2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">热评</view>
			</view>
		</view>
		
		<view class="d-kuan d-shangxia-15" @click="url('yingyong/index',5)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 5}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/guanzhu2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">关注用户</view>
			</view>
		</view>
		<!--view class="d-kuan d-shangxia-15" @click="url('yingyong/index',6)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 6}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/yingyong.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">关注圈子</view>
			</view>
		</view-->
		<view class="d-kuan d-shangxia-15"  @click="url('yingyong/index',7)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 7}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/shoucang2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">收藏</view>
			</view>
		</view>
		<view class="d-kuan d-shangxia-15"  @click="url('yingyong/index',8)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 8}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/dianzan2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">点赞</view>
			</view>
		</view>
		<view class="d-kuan d-shangxia-15"  @click="url('yingyong/index',9)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 9}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/pinglun2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">评论</view>
			</view>
		</view>
		<view class="d-kuan d-shangxia-15"  @click="url('yingyong/index',10)">
			<view class="daohang-1  d-yuanjiao-50 " :class="{'d-beijing-bai': activeLei === 10}">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/lishi2.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu">历史</view>
			</view>
		</view>
		<view class="d-kuan d-shangxia-20" @click="fubu">
			<view class="daohang-4  d-yuanjiao-50 ">
				<view class="daohang-2  ">
					<uv-avatar class="d-zuo-10" size="26" src="/static/img/qingchun-fabu.png"></uv-avatar>
				</view>
				<view class="daohang-3 d-jiacu" >发布帖子</view>
			</view>
		</view>

    </view>
</template>

<script>
export default {
    data() {
        return {
            title: 'Hello',
            leftNavHeight: '500rpx', // 默认高度
		denglu_xianshi: 0,
            activeLei: uni.getStorageSync('activeLei') || 0, // 从本地存储获取或默认为0
            
            //currentPage: '' // 添加当前页面状态
        }
    },
    computed: {
        currentPage() {
            // 从本地存储获取当前页面
            return uni.getStorageSync('currentPage') || '';
        },
		uid() {
	    return this.$store.state.memberuid;
	  },
    },
	watch: {
		activeLei(newVal, oldVal) {
			//打印
			//console.log('当前页面id:', newVal);
			uni.setStorageSync('activeLei', newVal);
		},

	},
    // 组件挂载时执行一次初始化
    mounted() {
        // 从本地存储恢复activeLei值

        this.activeLei = uni.getStorageSync('activeLei') || 0;
        
        // 获取并设置当前页面路径
        try {
            const pages = getCurrentPages();
            if(pages.length > 0) {
                const currentRoute = pages[pages.length-1].route;
                if(currentRoute) {
                    uni.setStorageSync('currentPage', currentRoute.replace('pages/', ''));
                }
            }
        } catch (e) {
            console.error('获取当前页面路径失败:', e);
        }
        
        this.$forceUpdate();
    },
    
    // 组件激活时更新数据（替代onShow，确保普通组件也能正常读取数据）
    activated() {
        // 从本地存储恢复activeLei值
        this.activeLei = uni.getStorageSync('activeLei') || 0;
        
       // console.log('当前页面id------:', this.activeLei);
        // 确保currentPage值准确
        try {
            const pages = getCurrentPages();
            if(pages.length > 0) {
                const currentRoute = pages[pages.length-1].route;
                if(currentRoute) {
                    uni.setStorageSync('currentPage', currentRoute.replace('pages/', ''));
                }
            }
        } catch (e) {
            //console.error('获取当前页面路径失败:', e);
        }
        
        this.$forceUpdate();
    },
    
    // 兼容小程序页面组件的onShow
    onShow() {
        this.activated();
    },
    methods: {
        shouye(page){
            this.setCurrentPage(page);
        	// 触发父组件的清理音频方法
        	this.$emit('clear-audio');
        	uni.switchTab({
        		url: '/pages/index/index',
        		success: () => {
        		  this.$forceUpdate(); // 强制更新视图
        		},
        		fail: (err) => {
        			console.error('跳转失败:', err)
        		}
        	})
        },
        url(url,lei,id){
			// 如果未登录，停止后续逻辑执行
			if(lei > 4) {
				if(!this.uid){
					this.denglu_xianshi = this.denglu_xianshi === 0 ? 1 : 0;
					this.$emit('denglu-fabu');
					return; // 未登录，提前返回，不执行后续代码
				}
			}
			//判断是不是 首页
			// 修改为判断当前页面是否为首页，而不是判断点击的链接是否为首页
			const isHomePage = this.currentPage === 'index/index';
			if(isHomePage){
				//console.log('当前页面为首页:', isHomePage);
				//如果是首页，那么就直接跳转，删除本地存储的leixing_id
				uni.removeStorageSync('leixing_id');
				this.activeLei = lei;
				uni.setStorageSync('activeLei', lei); // 保存到本地存储
				//console.log('触发leixing事件，id值:', lei);
				this.setCurrentPage(url);

				if(lei > 4){
					this.denglu_xianshi = this.denglu_xianshi === 0 ? 1 : 0;
					this.$emit('denglu-fabu');
				}
				this.$emit('leixing',lei);
			} else {
				uni.setStorageSync('leixing_id', lei);
				this.activeLei = lei;
				uni.setStorageSync('activeLei', lei); // 保存到本地存储
				//console.log('当前页面不是首页id:', this.activeLei);
				
				// 先强制更新视图，确保UI变化立即显示
				this.$forceUpdate();
				
				// 强制更新视图
				this.$forceUpdate();
				
				// 使用setTimeout添加延迟，确保DOM有足够时间完全更新后再跳转
				setTimeout(() => {
					// 再次强制更新视图
					this.$forceUpdate();
					//不是首页，那么就跳转回到首页
					uni.switchTab({
						url: '/pages/index/index',
						success: () => {
						this.$forceUpdate(); // 强制更新视图
						}
					});
				}, 200); // 200毫秒延迟
			}

		},
        setCurrentPage(page) {
            // 保存到本地存储
            uni.setStorageSync('currentPage', page);
            this.$forceUpdate();
        },
        isCurrentPage(page) {
            return this.currentPage === page;
            //const result = this.currentPage === page;
           // console.log(`检查页面 ${page}, 当前页面 ${this.currentPage}, 结果: ${result}`); // 添加日志
            //return result;
        },
		// 发布帖子
        fubu() {
            // 检查用户是否登录
            this.denglu_xianshi = this.denglu_xianshi === 0 ? 1 : 0;
			this.$emit('denglu-fabu');
			if(this.denglu_xianshi == 0){
				uni.switchTab({
					url: '/pages/quan/index',
					success: () => {
					this.$forceUpdate(); // 强制更新视图
					}
				});
			}
        },
		geren(){
			//this.denglu_xianshi = this.denglu_xianshi === 0 ? 1 : 0;
			//this.$emit('denglu-fabu');
			
			/*if(this.denglu_xianshi ==0){
				
			}*/
			uni.navigateTo({
				url: '/pages/u/index?uid='+this.uid,
				success: () => {
				this.$forceUpdate(); // 强制更新视图
				}
			});
		}
        
    },
    mounted() {
        // 初始化时从路由获取当前页面
        const pages = getCurrentPages();
        if(pages.length > 0) {
            const route = pages[pages.length-1].route;
            this.setCurrentPage(route.replace('pages/', ''));
        }
    }
}
</script>

<style scoped>
.daohang-1.d-beijing-bai {
    background-color: white !important; /* 确保样式优先级 */
}
</style>